import { get } from '@/utils/request';
import { message, Select } from 'antd';
import { useEffect, useState } from 'react';

const ChargeStationSelect = (props) => {
  const { value, onChange } = props;
  const [options, setOptions] = useState([]);

  useEffect(() => {
    const fetchChargeStation = async () => {
      try {
        const data = await get('/datas/charge/station/list', {
          index: 0,
          size: 0,
        });
        setOptions(data);
      } catch (error) {
        console.error('获取充换电站数据失败:', error);
        message.error('获取充换电站数据失败');
      }
    };

    fetchChargeStation();
  }, []);

  return (
    <Select
      placeholder="请选择充换电站"
      allowClear
      showSearch
      filterOption={(input, option) =>
        option.chargeStationName.toLowerCase().includes(input.toLowerCase())
      }
      style={{ width: '100%' }}
      fieldNames={{ label: 'chargeStationName', value: 'chargeStationId' }}
      {...props}
      value={value}
      onChange={onChange}
      options={options}
    />
  );
};

export default ChargeStationSelect;
